<template>
  <!--<div class="wrapper" ref="wrapper">
    <div class="content">
      <ul v-for="product in productList.data">
        <li v-text="product.name"></li>
      </ul>
    </div>
  </div>-->


  <div class="bscroll-container">
    <ul>
      <li  v-for="product in productList.data">
        <div class="scroller">
          <div>
            <p v-text="product.company_name">
            <p v-text="product.address"></p>
          </div>
          <div class="bottom" v-on:click="addProduct(product)">+</div>
        </div>
      </li>

    </ul>
  </div>


</template>

<script>
  import BScroll from 'better-scroll'
  //引入jquery
  import $ from 'jquery'
    export default {
      props:['productList','total'],
      name: "Content",
      data () {
        return {
          childValue: ''
        }
      },
      mounted(){
        this.initContentH();
      },
      methods:{
        initContentH(){


        },
        addProduct(obj){

          var adminid = obj.admin_id;
          this.total = this.total+adminid;
          this.childValue = this.total;
          this.$emit('childByValue', this.childValue)
        }
      }
    }
</script>

<style scoped>
  li {
    padding: 2rem 0;

    border-bottom: 1px solid #f1f1f1;
  }
  .content{
    width: 100%;
    overflow: hidden;
    overflow-y: scroll;
  }
  .bottom{
    background: salmon;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    line-height: 50px;
    color: #fff;
  }
  .scroller{
    display: flex;
    display: -webkit-flex;
    justify-content: space-between;
    -webkit-justify-content: space-between;
  }


</style>
